<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <!-- import CSS -->
  <link rel="stylesheet" href="static/css/index.css">
</head>
<body>
  <div id="app3">
    <div class="login">
        <div class="login-con">
          <el-card icon="log-in" title="欢迎登录">
            <div class="form-con">
              <p class="login-tip">输入任意用户名和密码即可</p>
            </div>
          </el-card>
        </div>
      </div>
  </div>
</body>
  <!-- import Vue before Element -->
  <script src="static/js/vue.js"></script>
  <!-- import JavaScript -->
  <script src="static/js/index.js"></script>
  <script src="static/js/http.js"></script>
  <script>
    new Vue({
      el: '#app3',
      data: function() {
        return { 
        }
      },
      computed: {
        
      },
      methods: {
      },
      mounted () {
        
      },
      created(){
        
      },
      destroyed: function() {
      },
      watch: {
      }
    })
  </script>
  <style type="text/css">
    .login{
      width: 100%;
      height: 100%;
      background-image: url('static/img/login-bg.jpg');
      background-size: cover;
      background-position: center;
      position: relative;
    }
    .login-con{
        position: absolute;
        right: 160px;
        top: 50%;
        transform: translateY(-60%);
        width: 300px;
    }
    .form-con{
        padding: 10px 0 0;
    }
    .login-tip{
        font-size: 10px;
        text-align: center;
        color: #c3c3c3;
    }
    .login-con-header{
        font-size: 16px;
        font-weight: 300;
        text-align: center;
        padding: 30px 0;
    }
  </style>
</html>